<template>
    <div class="center">
        <div class="center-form">
            <el-form inline label-width="120px" @submit.native.prevent>
            <el-form-item label="门店名称">
              <el-input v-model="listParsem.shopName" placeholder="请输入门店名称" clearable class="selWidth" size="small" />
            </el-form-item>
            <el-form-item label="门店编号">
              <el-input v-model="listParsem.storeId" placeholder="请输入门店编号" clearable class="selWidth" size="small" />
            </el-form-item>
            <!-- <el-form-item label="所属地区">
                <el-cascader
                   placeholder="请选择所属地区"
                   v-model="listParsem.business_address"
                   :options="regionList"
                   :props="{ expandTrigger: 'hover' }"
                   @change="regionChange">
                </el-cascader>
            </el-form-item> -->
            <el-form-item label="门店信息状态">
                <el-select v-model="listParsem.merchantType" clearable  placeholder="请选择门店信息状态" >
                  <el-option
                    v-for="item in storeList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
            </el-form-item>
            <!--  -->
            <el-form-item label=" ">
              <el-button
                icon="el-icon-search"
                type="primary"
                @click="initList"
                >搜索</el-button
              >
              <el-button icon="el-icon-refresh" type="primary" @click="resetList"
                >重置</el-button
              >
            </el-form-item>
          </el-form>
        </div>
        <div class="center-construct">
            <el-button type="primary" style="margin-right: 10px;"  @click="dataSynchronize">门店同步</el-button>
            <el-button type="primary" v-if="rolesId == 1 || rolesId == 8 "  @click="addStoreDialogClick" style="margin-right: 30px;">新增门店</el-button>
        </div>
        <div class="center-table">
        <el-table
          :data="tableList"
          tooltip-effect="dark"
          style="width: 100%"
          stripe
          :header-cell-style="tableHeaderColor"
          v-loading="tableLoading"
        >
        <el-table-column
            prop="storeId"
            label="门店编号"
            align="center"
            width="220"
          ></el-table-column>
        <el-table-column
            prop="shopName"
            label="门店名称"
            align="center"
            width="200"
          ></el-table-column>
          <el-table-column
            label="门头照"
            align="center"
            width="200"
          >
          <template slot-scope="scope">
              <el-image 
                style="width: 100px; height: 100px"
                :src="scope.row.outDoorImages" 
                :preview-src-list="[scope.row.outDoorImages]">
              </el-image>
          </template>
          </el-table-column>
          <el-table-column
            prop="address"
            label="经营地址"
            align="center"
            width="260"
          >
            <template slot-scope="scope">
              <p v-if="scope.row.provinceLable"> {{ scope.row.provinceLable + scope.row.cityLable +  scope.row.districtLable + scope.row.address}} </p>
            </template>
          </el-table-column>
          <el-table-column
            label="经营时间"
            align="center"
            width="200"
            show-overflow-tooltip
          >
           <template slot-scope="scope">
              周{{ scope.row.businessTime[0].weekDayLable }} 至 周{{ scope.row.businessTime[scope.row.businessTime.length - 1].weekDayLable }} {{ scope.row.businessTime[0].openTime }} - {{ scope.row.businessTime[0].closeTime }}
           </template>
          </el-table-column>
          <el-table-column
            prop="contactPhone"
            label="联系方式"
            align="center"
            width="150"
          >
           <template slot-scope="scope">
               <p> {{  scope.row.contactPhone || scope.row.contactMobile  }}</p>
           </template>
          </el-table-column>
          <el-table-column
            prop="newShopCategoryName"
            label="经营行业"
            align="center"
            width="170"
          ></el-table-column>
          <!-- <el-table-column
            prop="binding_alipay_logon_id"
            label="备注"
            align="center"
            width="150"
          ></el-table-column> -->
          <el-table-column
            prop="shopStatus"
            label="门店信息状态"
            align="center"
            fixed="right"
            width="150"
          >
            <template slot-scope="scope">
               <p>{{ funShopStatus(scope.row.shopInfoStatus) }}</p>
            </template> 
          </el-table-column>
          <el-table-column
              fixed="right"
              align="center"
              width="180"
              label="操作">
               <template slot-scope="scope">
               <el-button
                   v-if="scope.row.shopStatus == '01' || scope.row.shopStatus == '02'"
                   slot="reference"
                   type="text"
                   @click="getStoreInfo(scope.row)"
                   >详情</el-button>
                   <el-button
                   slot="reference"
                   type="text"
                   @click="upDataStoreDialog(scope.row)"
                   v-if="(scope.row.shopStatus == '01' || scope.row.shopStatus == '02' )|| (rolesId == 1 || rolesId == 8) "
                   >编辑</el-button>
                   <el-button
                   slot="reference"
                   type="text"
                   v-if="!scope.row.merchantId && (rolesId == 1 || rolesId == 8 )"
                   @click="systemBinding(scope.row)"
                   >系统绑定</el-button>
               </template>
          </el-table-column>
        </el-table>
        <div class="pagination">
          <el-pagination
            background
            @current-change="handleCurrentChange"
            @size-change="sizechange"
            :current-page.sync="cur_page"
            :page-size="10"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          ></el-pagination>
        </div>
        </div>
        <el-dialog
         title="系统绑定"
         :visible.sync="systemVisible"
         width="470px"
         >
         <div>
            <el-form
            :model="systemFrom"
            ref="systemFrom"
            label-width="100px"
            >
              <el-form-item label="所属商户" prop="merchantName" :rules="[ { required: true, message: '请选择所属商户', trigger: 'change' }]">
                <el-autocomplete @select="merchantIdSelect" style="width: 300px;" v-model.trim="systemFrom.merchantName" :fetch-suggestions="merchantslist" :debounce="300" placeholder="请输入商户名称进行查询" ></el-autocomplete>
              </el-form-item> 
              <el-form-item label="所属门店" prop="shopName" :rules="[ { required: true, message: '请选择所属门店', trigger: 'change' }]">
                <el-autocomplete  v-model.trim="systemFrom.shopName"  :fetch-suggestions="chantShopFetchlist" :debounce="300" style="width: 300px;"  placeholder="请输入门店名称进行查询"  @select="shopSelect" />
              </el-form-item> 
             </el-form>
           </div>
         <span slot="footer" class="dialog-footer">
              <el-button @click="systemVisible = false">取 消</el-button>
              <el-button type="primary" @click="systemBindingClick">确 定</el-button>
          </span>
       </el-dialog>
       
       <el-dialog
         :title="storeFrom.mode ? '查看门店' : storeFrom.id ? '编辑门店' : '新增门店'"
         :visible.sync="storeVisible"
         width="480px"
         @close="storeClose"
         >
         <div class="construct-dialog">
            <el-form
            :model="storeFrom"
            ref="storeFrom"
            label-width="100px"
            :rules="rulesFrom"
            >
              <el-form-item label="选择商户" prop="ipRoleId">
                <el-select   :disabled="storeFrom.mode" v-model="storeFrom.ipRoleId"  filterable placeholder="请选择商户" >
                    <el-option
                      v-for="item in merchantList"
                      :key="item.merchantPid"
                      :label="item.merchantName"
                      :value="item.merchantPid">
                    </el-option>
                  </el-select>
                   <!-- <el-input   v-model="storeFrom.ipRoleId" placeholder="请输入商户PID"></el-input> -->
              </el-form-item>
              <el-form-item label="省市区信息" prop="serviceRegion" >
                <el-cascader
                   :disabled="storeFrom.mode"
                   style="width: 340px;"
                   v-model="storeFrom.serviceRegion"
                   :options="regionList"
                   :props="{ expandTrigger: 'hover' }"
                   @change="regionChange">
                </el-cascader>
              </el-form-item> 
              <el-form-item label="详细地址" prop="businessAddress.address">
                   <el-input :disabled="storeFrom.mode"  @input="addressInput" v-model="storeFrom.businessAddress.address" placeholder="请输入详细地址"></el-input>
               </el-form-item>
               <el-form-item label="门店类目" prop="shopCategory">
                 <el-select :disabled="storeFrom.mode" style="width: 340px;" v-model="storeFrom.shopCategory" placeholder="请选择门店类目">
                   <el-option
                     v-for="item in categoryIdsList"
                     :key="item.value"
                     :label="item.label"
                     :value="item.value">
                   </el-option>
                 </el-select>
               </el-form-item>
               <el-form-item label="门店类型" prop="shopType">
                 <el-select :disabled="storeFrom.mode" v-model="storeFrom.shopType" style="width: 340px;" placeholder="请选择门店类型">
                   <el-option label="直营" value="01" />
                   <el-option label="加盟" value="02" />
                 </el-select>
               </el-form-item>
               
               <el-form-item label="门店名称" prop="shopName">
                   <el-input :disabled="storeFrom.mode"  v-model="storeFrom.shopName" placeholder="请输入门店名称"></el-input>
               </el-form-item>
               <el-form-item label="门头照"  ref="outDoorimages" prop="outDoorimages">
                <el-upload
                  :disabled="storeFrom.mode"
                  v-model="storeFrom.outDoorimages"
                  :action="uploadUrl"
                  :headers="token"
                  :show-file-list="false"
                  :on-success="inDoorImagesSuccess"
                  >
                  <img v-if="storeFrom.outDoorimagesUrl" :src="storeFrom.outDoorimagesUrl" class="avatar">
                  <i v-else class="el-icon-plus"></i>
                </el-upload>
               </el-form-item>
               <el-form-item label="法人名称" prop="legalName">
                   <el-input :disabled="storeFrom.mode" v-model="storeFrom.legalName" placeholder="请输入法人名称"></el-input>
               </el-form-item>
               <el-form-item label="法人证件号" prop="legalCertNo">
                   <el-input :disabled="storeFrom.mode" v-model="storeFrom.legalCertNo" placeholder="请输入法人证件号"></el-input>
               </el-form-item>
               <el-form-item label="联系电话" prop="contactPhone">
                   <el-input :disabled="storeFrom.mode"  v-model="storeFrom.contactPhone" placeholder="请输入联系固定电话"></el-input>
               </el-form-item>
               <el-form-item label="联系手机号" prop="contactMobile">
                   <el-input :disabled="storeFrom.mode" v-model="storeFrom.contactMobile" placeholder="请输入联系手机号"></el-input>
               </el-form-item>
               <el-form-item label="门店编号" prop="storeId">
                   <el-input :disabled="storeFrom.mode"  v-model="storeFrom.storeId" placeholder="请输入外部门店编号"></el-input>
               </el-form-item>
               <el-form-item label="结算收款账号" >
                   <el-input :disabled="storeFrom.mode"  v-model="storeFrom.settleAlipayLogonId" placeholder="请输入门店结算收款的支付宝账号"></el-input>
               </el-form-item>
               <el-form-item label="开放时间" prop="weekDayList">
                  <el-select :disabled="storeFrom.mode" style="width: 340px;" multiple @change="blurWeekDay"  v-model="storeFrom.weekDayList" placeholder="请选择开放时间">
                    <el-option label="周一" :value="1" />
                    <el-option label="周二" :value="2" />
                    <el-option label="周三" :value="3" />
                    <el-option label="周四" :value="4" />
                    <el-option label="周五" :value="5" />
                    <el-option label="周六" :value="6" />
                    <el-option label="周日" :value="7" />
                  </el-select>
               </el-form-item>
               <el-form-item label="开门时间" prop="openTime">
                <el-time-select
                :disabled="storeFrom.mode"
                @blur="timeChange"
                format="HH:mm"
                  value-format = "HH:mm"
                  placeholder="请选择开门时间"
                  v-model="storeFrom.openTime"
                  :picker-options="{
                    start: '00:00',
                    step: '00:5',
                    end: '23:59'
                  }">
                </el-time-select>
               </el-form-item>
               <el-form-item label="关门时间" prop="closeTime">
                <el-time-select
                :disabled="storeFrom.mode"
                @blur="timeChange"
                format="HH:mm"
                  value-format = "HH:mm"
                  placeholder="请选择关门时间"
                  v-model="storeFrom.closeTime"
                  :picker-options="{
                    start: '00:00',
                    step: '00:5',
                    end: '23:59'
                  }">
                </el-time-select>
               </el-form-item>
               <el-form-item label="备注" >
                   <el-input  :disabled="storeFrom.mode" v-model="storeFrom.memo" placeholder="请输入备注"></el-input>
               </el-form-item>
             </el-form>
             
           </div>
         <span slot="footer" class="dialog-footer" v-if="!storeFrom.mode" >
              <el-button @click="storeVisible = false">取 消</el-button>
              <el-button type="primary" @click="storeStatusClick" v-loading="storeLoading">确 定</el-button>
          </span>
       </el-dialog>

       <el-dialog
         title="门店同步"
         :visible.sync="synVisible"
         width="470px"
         >
         <div>
            <el-form
            :model="synFrom"
            ref="synFrom"
            label-width="100px"
            >
              <el-form-item label="门店ID" prop="shop_id" :rules="[ { required: true, message: '请输入门店Id', trigger: 'change' }]">
                <el-input  v-model="synFrom.shop_id" placeholder="请输入门店ID"></el-input>
              </el-form-item> 
             </el-form>
           </div>
         <span slot="footer" class="dialog-footer">
              <el-button @click="synVisible = false">取 消</el-button>
              <el-button type="primary" v-loading="dataLoading"  @click="synFromdingClick">确 定</el-button>
          </span>
       </el-dialog>
    </div>
</template>
<script>
import { simpleCreateQuery , shopModify , simpleCreateUpload , shopCreate , bindShop , synShopInfo , getAreaList , shopQueryList } from "@/api/fetchApi"
import { merchantlist , shopall } from "@/api/api";
export default{
    data(){
        return{
            uploadUrl: process.env.VUE_APP_BASE_URL + "/product/v31/api/merchant/uploadfile/upload",
            token: { token: sessionStorage.getItem("token") },
            listParsem:{page:1,size:10},
            storeList:[{label:'全部',value:''},{label:'已认证',value:'01'},{label:'待优化',value:'02'},{label:'审核中',value:'03'}],
            tableLoading:false,
            synFrom:{},
            synVisible:false,
            tableList:[],
            regionList:[],
            categoryIdsList:[{ label:'美容美发',value:'B0044'}],
            dataLoading:false,
            total:0,
            systemVisible:false,
            systemFrom:{},
            storeFrom:{
              businessAddress:{},
              openTime:'',
              closeTime:''
            },
            rolesId:'',
            rulesFrom:{
              ipRoleId:[{ required: true, message: '请输入商户ID', trigger: 'blur' }],
              serviceRegion:[{ required: true, message: '请选择省市区信息', trigger: 'blur' }],
              'businessAddress.address':[{ required: true, message: '请输入详细地址', trigger: 'blur' }],
              shopCategory:[{ required: true, message: '请选择门店类目', trigger: 'change' }],
              shopType:[{ required: true, message: '请选择门店类型', trigger: 'change' }],
              shopName:[{ required: true, message: '请输入门店名称', trigger: 'change' }],
              legalName:[{ required: true, message: '请输入法人名称', trigger: 'change' }],
              legalCertNo:[{ required: true, message: '请输入法人证件号', trigger: 'change' }],
              contactPhone:[{ required: true, message: '请输入联系固定电话', trigger: 'change' }],
              contactMobile:[{ required: true, message: '请输入联系手机号', trigger: 'change' }],
              weekDayList:[{ required: true, message: '请选择门店开放时间', trigger: 'change' }],
              openTime:[{ required: true, message: '请选择开门时间', trigger: 'change' }],
              closeTime:[{ required: true, message: '请选择关门时间', trigger: 'change' }],
              storeId:[{ required: true, message: '请输入外部门店编号', trigger: 'change' }],
              outDoorimages:[{required: true, validator:(rule , value , callback)=>{
                    if(this.storeFrom.outDoorimagesUrl){
                        callback();
                    }else{
                        callback(new Error('请上传门头照！'));
                    }
                 } }],
            },
            storeVisible:false,
            storeLoading:false,
            merchantList:[]
        }
    },
    mounted(){
       this.initList()
       this.initAuthority()
       this.initSimpleCreateQuery()
    },
    methods:{
        async initList(){
          this.tableList = []
          const res = await shopQueryList(this.listParsem)
          this.total = res.pageInfo.recordCount
          this.initArealist(res.data)
        },
        initAuthority(){
          let userinfo = JSON.parse(sessionStorage.getItem("userInfo"))
          this.rolesId = userinfo.rolesId
        },
        async initSimpleCreateQuery(){
           this.merchantList = []
           const res =  await simpleCreateQuery({page:1,size:999999})
           this.total = res.pageInfo.recordCount
           res.data.forEach(item=>{
             this.merchantList.push(item.cycleMerchantDO)
          })
        },
        async initArealist(v){
           const res = await getAreaList()
           this.regionList = res.areaItems
           this.funArealistLable(v)
 
        },
        addressInput(v){
            this.storeFrom.businessAddress.address = v
            this.$forceUpdate()
        },
        initStoreCum(res){
        const dayList = [ {value:1,lable:'一'} , {value:2,lable:'二'} , {value:3,lable:'三'} , {value:4,lable:'四'} , {value:5,lable:'五'} , {value:6,lable:'六'} , {value:7,lable:'日'} ]
        if(res.businessTime){
          res.businessTime.forEach(item=>{
        let data =  dayList.find(dayItem=> dayItem.value == item.weekDay)  
           if(data){
             item.weekDayLable = data.lable
           }
        })
        }
        
        this.tableList.push(res)
       },
        addStoreDialogClick(){
          this.storeVisible = true
          this.storeFrom = { businessAddress:{} , openTime:'' , closeTime:'' }
          this.$nextTick(()=>{
              this.$refs.storeFrom.clearValidate()
            })
        },
        regionChange(v){
          this.storeFrom.businessAddress.provinceCode = v[0]
          this.storeFrom.businessAddress.cityCode = v[1]
          this.storeFrom.businessAddress.districtCode = v[2]
        },
        async getStoreInfo(v){
             v =   JSON.parse(JSON.stringify(v))
             v.mode = true
             this.upDataStoreDialog(v)
        },
        // 编辑弹框
        async upDataStoreDialog(v){
            this.storeFrom = JSON.parse(JSON.stringify(v))
            this.storeFrom.serviceRegion = [v.provinceCode , v.cityCode , v.districtCode]
            this.storeFrom.shopCategory = this.storeFrom.newShopCategory
            this.storeFrom.ipRoleId = this.storeFrom.merchantPid
            this.storeFrom.businessAddress = {address:this.storeFrom.address,provinceCode:this.storeFrom.provinceCode , cityCode:this.storeFrom.cityCode, districtCode:this.storeFrom.districtCode}
            this.storeFrom.openTime = this.storeFrom.businessTime[0].openTime
            this.storeFrom.closeTime = this.storeFrom.businessTime[0].closeTime
            this.storeFrom.outDoorimagesUrl = this.storeFrom.outDoorImages
            // console.log(this.storeFrom)
            this.storeFrom.outDoorImages = ''
            this.storeFrom.weekDayList = []
            console.log(this.storeFrom.outDoorimages)
            this.storeFrom.businessTime.forEach(item=>{
              this.storeFrom.weekDayList.push(item.weekDay)
            })
            this.storeVisible = true
        },
        async storeStatusClick(){
          const valid  = await this.$refs.storeFrom.validate()
          if(valid){
            this.storeFrom.businessTime = []
            this.storeFrom.weekDayList.forEach(item=>{
            this.storeFrom.businessTime.push({weekDay:item,openTime:this.storeFrom.openTime,closeTime:this.storeFrom.closeTime})
          })
          this.storeFrom =  this.removeEmptyValues(this.storeFrom)
          this.storeStatusApi(this.storeFrom)  
        }
        },
        removeEmptyValues(obj) {
         return Object.keys(obj)
           .filter(key => obj[key] !== null && obj[key] !== undefined && obj[key] !== '' && obj[key]!='0')
           .reduce((acc, key) => {
             acc[key] = obj[key];
             return acc;
           }, {});
         },
         storeClose(){
          this.storeFrom = { businessAddress:{} , openTime:'' , closeTime:'' }
          this.$nextTick(()=>{
              this.$refs.storeFrom.clearValidate()
            })
         },
        timeChange(v){
           this.$forceUpdate()
        },
        blurWeekDay(v){
           this.$forceUpdate()

        },
       async storeStatusApi(v){
        this.storeLoading = true
        if(v.id){
          const res = await  shopModify(v)
          if(res.code == 200){
            this.initList()
            this.storeVisible = false
            this.$message.success('操作成功')
            this.storeLoading = false
         }else{
            this.storeLoading = false
            this.$message.error(res.msg)
         }
        }else{
          const res = await  shopCreate(v)
         if(res.code == 200){
            this.initList()
            this.storeLoading = false
            this.storeVisible = false
            this.$message.success('操作成功')
         }else{
            this.storeLoading = false
            this.$message.error(res.msg)
         }
        }
        // 
         
       },
       async inDoorImagesSuccess(v){
            this.storeFrom.outDoorimagesUrl = v.data.filePath
            const res = await simpleCreateUpload({imgUrl:v.data.filePath,name:'门头照'})
            this.storeFrom.outDoorimages = res.image_id
            this.$forceUpdate()
           this.$refs.outDoorimages.clearValidate()
        },
        async dataSynchronize(){
          this.synVisible = true
          // this.dataLoading = true
          //     const res = await synShopInfo({pageNum:1,pageSize:100})
          //     if(res.code == '200'){
          //       this.dataLoading = false
          //       this.$message.success('同步成功')
          //       this.initList()
          //     }else{
          //       this.dataLoading = false
          //       this.$message.error(res.msg)
          //     }
        },
       async synFromdingClick(){
        
          const valid  = await this.$refs.synFrom.validate()
          if(valid){
                this.dataLoading = true
                const res = await synShopInfo({shop_id:this.synFrom.shop_id})
                if(res.code == '200'){
                this.dataLoading = false
                this.synVisible = false
                this.$message.success('同步成功')
                this.initList()
              }else{
                this.dataLoading = false
                this.$message.error(res.msg)
              }
          }
        },
     // 系统绑定
     async systemBindingClick(){
          const valid  = await this.$refs.systemFrom.validate()
          if(valid){
             const res = await bindShop(this.systemFrom)
             if(res.code == 200){
               this.$message.success('操作成功！');
               this.initList()
               this.systemVisible = false
             }else{
              this.$message.error(res.message);
             }
          }
        },
        
        systemBinding(v){
            this.systemVisible = true
            this.systemFrom.shopId = v.shopId
            
        },
        chantShopFetchlist(queryString, cb) {
         let sosolist = {};
         sosolist = {
             page: 1,
             size: 20,
             merchantId: this.systemFrom.merchantId,
             shopName: this.systemFrom.shopName,
           };
           shopall(sosolist).then(res => {
           // console.log(res);
           if (res.code == 405) {
             sessionStorage.removeItem("token");
             this.$router.push("/login");
           } else {
              let merchantarrlist = []
             for(var i=0;i<res.data.rows.length;i++){
              merchantarrlist.push({'value':res.data.rows[i].shopName + ' — ' + res.data.rows[i].shopNo,'id':res.data.rows[i].id})
             }
              let results = queryString
               ? merchantarrlist.filter(this.createFilter(queryString))
               : merchantarrlist
             // 调用 callback 返回建议列表的数据
             cb(results)
           }
         })
         },
         shopSelect(item) {
          this.systemFrom.lsyShopId = item.id
          this.systemFrom.shopName = item.value
         },

         merchantslist(queryString, cb) {
         let sosolist = {};
         sosolist = {
             page: 1,
             size: 20,
             merchantName: this.systemFrom.merchantName,
           };
         merchantlist(sosolist).then(res => {
           // console.log(res);
           if (res.code == 405) {
             sessionStorage.removeItem("token");
             this.$router.push("/login");
           } else {
              let merchantarrlist = []
             for(var i=0;i<res.data.length;i++){
              merchantarrlist.push({'value':res.data[i].merchantName + ' — ' + res.data[i].merchantNo,'id':res.data[i].id})
             }
              let results = queryString
               ? merchantarrlist.filter(this.createFilter(queryString))
               : merchantarrlist
             // 调用 callback 返回建议列表的数据
             cb(results)
           }
         })
         },
         merchantIdSelect(item) {
          this.systemFrom.merchantId = item.id
          this.systemFrom.merchantName = item.value
         },
         createFilter(queryString) {
           return restaurant => {
           return (
           restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1
           )
          }
        },
        funShopStatus(v){
           const data = this.storeList.find(item=>item.value == v)
           return data.label
        },
        funArealistLable(v){
          v.forEach(item=>{
             const provinceData = this.regionList.find(aItem=> aItem.value == item.provinceCode)
             if(provinceData){
               item.provinceLable = provinceData.label
               const cityData = provinceData.children.find(cItem=>cItem.value == item.cityCode)
                if(cityData){
                item.cityLable = cityData.label
                if(cityData.children){
                  const districtData = cityData.children.find( dItem => dItem.value == item.districtCode)
                  if(districtData){
                    item.districtLable = districtData.label
                  }
                }
                }
                
             }
              if(item.businessTime){
                item.businessTime = JSON.parse(item.businessTime)
              }
             this.initStoreCum(item)
          })
            
          // this.tableList = v
          this.$forceUpdate()
        },
        resetList(){
          this.listParsem = {page:1,size:10}
          this.initList()
        },
        handleCurrentChange(val) {
          this.listParsem.page = val;
          this.initList()
        },
        sizechange(val) {
          this.listParsem.size = val;
          this.initList()
        },
        tableHeaderColor({ row, column, rowIndex, columnIndex }) {
          if (rowIndex === 0) {
            return "background-color: #F0F0F0;font-weight: 500;font-size:14px;color:#000;";
          }
       },
    }
}
</script>
<style scoped>
.center{
    width: 100%;
    height: calc(100% - 30px);
    background-color: #fff;
    padding-top: 30px;
}
.center-form{
  padding: 0 22px;
}
.center-construct{
    width: 100%;
    display: flex;
    justify-content: end;
    margin-bottom: 30px;
}
.center-table{
    margin-top: 30px;
    padding: 0 20px;
}
.construct-dialog{
    height: 60vh;
    overflow-y: auto;
}
::v-deep .el-upload--text{
    width: 160px;
    height: 160px;
    line-height: 160px;
}
/* 针对 Firefox */
.construct-dialog {
  scrollbar-width: none; /* Firefox */
}
 
/* 针对 Chrome, Edge 和 Safari */
.construct-dialog::-webkit-scrollbar {
  width: 0; /* Chrome, Edge 和 Safari */
}
 
/* 针对 IE 10+ */
.construct-dialog {
  -ms-overflow-style: none;  /* IE 10+ */
}
 
/* 针对 IE 11 */
.construct-dialog {
  overflow: auto;
}
.avatar{
  width: 160px;
  height: 160px;
}
</style>